<extend name="Base/common" />
<block name="body">
	<!--导航引用-->
	<include file="Public/nav" />
	<footer class="ui-footer ui-footer-stable ui-border-t ui-btn-group ui-floating-btn">
		<button class="ui-btn-lg cartIndex"><i class="iconfont icon-cart">{:cartCount()}</i></button>
		<!-- 是否限购 -->
		<input type="hidden" id="is_ppl" value="{$row.is_ppl}">
		<!-- 库存	 -->
		<input type="hidden" id="ppl_num" value="{$row.ppl_num|default=0}">
		<!-- 判断用户是否允许购买 -->
		<input type="hidden" id="allow_buy" value="{$row.allow_buy|default=0}">
	    <button class="ui-btn-lg ui-btn-danger">加入购物车</button>
	</footer>
	<section class="ui-container">
	    <!-- <div class="ui-row-flex ui-border-tb tc ui-pxui-tab">
		    <div class="ui-col ui-border-r">
		    	<a href="{:U('goods_info', array('type' => 5, 'id' => $row['id']))}" class="ui-tiled ui-flex-pack-center">
		    		<span>测量方法</span>
		    	</a>
		    </div>
		    <div class="ui-col ui-border-r">
		    	<a href="{:U('goods_info', array('type' => 2, 'id' => $row['id']))}" class="ui-tiled ui-flex-pack-center">
		    		<span>品牌</span>
		    	</a>
		    </div>
		    <div class="ui-col ui-border-r">
		    	<a href="{:U('goods_info', array('type' => 3, 'id' => $row['id']))}" class="ui-tiled ui-flex-pack-center">
		    		<span>包装清单</span>
		    	</a>
		    </div>
		    <div class="ui-col ui-border-r">
		    	<a href="{:U('goods_info', array('type' => 4, 'id' => $row['id']))}" class="ui-tiled ui-flex-pack-center">
		    		<span>售后须知</span>
		    	</a>
		   	</div>
		</div> -->
		
		<div class="ui-slider ui-goods-slider">
		    <ul class="ui-slider-content">
		    	<volist name="photos" id="v">
		        	<li><img src="{$v}"/></li>
		        </volist>
		    </ul>
		</div>
		
		<!-- <ul class="ui-list ui-list-text ui-list-link ui-border-tb ui-detail-arrowlink">
		    <li class="ui-border-t">
		        <a href="#goods_info"><h5 class="ui-nowrap">点击查看图文详情？</h5></a>
		    </li>
		</ul> -->
		
		<div class="ui-whitespace ui-goods-title ui-tiled ui-border-b div_collect">
		    <h4>{$row.name}</h4>
		    <input type="hidden" name="id" id="id" value="{$row.id}" />
		    {$row.id|getCollect=###}
		</div>

		<ul class="ui-goodinfo ui-whitespace" id="goods_tip">
			<li class="price ui-tiled">
				<p>价格：</p>
				<b>￥{$row.price}/{$row.unit_id|getUnitName=###}</b>
				<small class="ui-txt-info">专柜价：</small> <del>￥{$row.shop_price}</del>
			</li>
			<li class="freight ui-tiled">
				<p>运费：</p>
				<span>免运费</span>
			</li>
			<!-- <li class="service ui-tiled">
				<p>服务：</p>
				<span>由点粉圈微商城提供售后服务</span>
			</li> -->
			<li class="color">
				<p>数量：</p>
				<div class="count ui-tiled ui-border" >
	        		<a href="javascript:void(0);" class="move iconfont ui-border-r">&#xe768;</a>
	        		<span class="number">1</span>
	        		<a href="javascript:void(0);" class="add iconfont ui-border-l">&#xe767;</a>
	        	</div>
			</li>
		</ul>
		<!--提示框开始-->
		<div class="ui-tooltips ui-tooltips-warn" style="display:none;">
		    <div class="ui-tooltips-cnt ui-border-b">
		        <span class="iconfont icon-warnfill ui-txt-highlight"></span>
		        	请选择颜色
		        <a href="javascript::" class="iconfont icon-roundclosefill ui-txt-info"></a>
		    </div>
		</div>
		<!--提示框结束-->


		<ul class="ui-list ui-list-text ui-list-link ui-border-tb ui-detail-arrowlink ui-goods-attribute-title goods_nature" style="display:none;">
		    <li class="ui-border-t">
		        <h5 class="ui-nowrap">商品属性</h5>
		        <div class="ui-txt-info">查看属性</div>
		    </li>
		</ul>
		
		<ul class="ui-row ui-goods-attribute ui-whitespace goods_nature_info">
		    <li>
		        <p>货号：{$info.gno}</p>
		    </li>
		    <li>
		        <p>品牌：{$info.brand_name}</p>
		    </li>
		    <li>
		        <p>款式：{$info.style}</p>
		    </li>
		    <li>
		        <p>颜色：{$info.color}</p>
		    </li>
		    <li>
		        <p>鞋面：{$info.xm_cz}</p>
		    </li>
		    <li>
		        <p>里皮：{$info.jijie}</p>
		    </li>
		    <li>
		        <p>鞋底：{$info.xd_cz}</p>
		    </li>
		    <li>
		        <p>闭合方式：{$info.bihe}</p>
		    </li>
		    <li>
		        <p>根底款式：{$info.sex}</p>
		    </li>
		    <li>
		        <p>鞋头款式：{$info.piancha}</p>
		    </li>
		    <li>
		        <p>上架时间：{$info.sj_time}</p>
		    </li>
		    <li>
		        <p>上市年份：{$info.ss_year}</p>
		    </li>
		</ul>
		<!-- 商品详情 -->
		<ul class="ui-list ui-list-text ui-border-tb ui-detail-arrowlink ui-goods-attribute-title">
		    <li class="ui-border-t">
		        <h5 class="ui-nowrap">商品详情</h5>
		    </li>
		</ul>
		
		<div class="ui-goods-info" id="goods_info">
			{$row.content}
		</div>
		<!-- 商品详情结束 -->
	    <!--版权引用-->
	    <include file="Public/m_footer" />
		<div class="ui-up"><a href="#"><i class="iconfont icon-fold"></i></a></div>

		<!--s Choose size-->
			<div class="ui-size-survey-wrap">
				<div class="ui-size-survey">
					<div class="ui-info ui-border-b">
						<img class="size_img_url" src="http://placeholder.qiniudn.com/100x100" width="80" height="80"/>
						<div class="ui-goods-txt">
							<h4 class="ui-txt-red">￥{$row.price}</h4>
						</div>
						<i class="iconfont icon-roundclosefill ui-txt-info"></i>
						<span class='ui-txt-muted'>单位（cm）</span>
					</div>
					<div class="ui-survey-info ui-whitespace">
						<div class="ui-form ui-user-measure show">
					        <div class="ui-form-item ui-form-item-l ui-border-b">
					            <label class="ui-border-r">脚长</label>
					            <input type="number" placeholder="您的脚长" name="foot_long" id="foot_long" value="{$data.foot_long|default=''}" autocomplete="off">
					        </div>
					        <div class="ui-form-item ui-form-item-l ui-border-b">
					            <label class="ui-border-r">最宽处脚围</label>
					            <input type="number" placeholder="您的脚宽" name="foot_width" id="foot_width" value="{$data.foot_width|default=''}" autocomplete="off">
					        </div>
					        <div class="ui-form-item ui-form-item-l ui-border-b">
					            <label class="ui-border-r">最高处脚围</label>
					            <input type="number" placeholder="您的脚围" name="foot_thick" id="foot_thick" value="{$data.foot_thick|default=''}" autocomplete="off">
					        </div>
					        <div class="ui-btn-wrap ui-btn-group ui-flex-pack-end">
							    <a href="javascript:void(0);" class="ui-btn measure" >测量方法</a>
							</div>
						</div>
					</div>
					<div class="ui-arrowlink ui-border-tb"><small>不需要量脚，直接选择尺码</small></div>
					<ul class="ui-size-list ui-whitespace user_size">
						<volist name="sizes" id="size">
							<li><a>{$size.name}</a></li>
						</volist>
						<li class='not-size'><a>我不知道</a></li>
					</ul>
					<a href="javascript:void(0);" class="ui-btn ui-btn-danger ui-choose-size-btn">确定</a>
				</div>
			</div><!--s Choose size-->

	</section>
</block>
<block name="script">
	<script type="text/javascript">
		(function(){
		    var slider = new fz.Scroll('.ui-slider', {
		        role: 'slider',
		        indicator: true,
		        autoplay: true,
		        interval: 3000
		    });
		
		})();
	    $('.ui-searchbar').tap(function(){
	        $('.ui-searchbar-wrap').addClass('focus');
	        $('.ui-searchbar-input input').focus();
	    });
	    $('.ui-searchbar-cancel').tap(function(){
	        $('.ui-searchbar-wrap').removeClass('focus');
	    });
		
		var temp_count = 1;
	    $('.color div a').tap(function(){
	    	var obj = $(this).parent().find('span');
	    	var num = Number(obj.html());		
	    	var is_ppl = $("#is_ppl").val();

	    	if ($(this).hasClass('move') && num == 1) {
	            $.tips({content:'商品数量不能再减少了',stayTime:2000,type:"success"});
	            return false;
	        }

	        if ($(this).hasClass('move')) {
	        	num = num - 1 <= 1 ? 1 : num - 1;
	        } else if ($(this).hasClass('add')) {
        		if(is_ppl == 1){
					num = 1;
	    			$.tips({content:'该商品属于限购产品，每个ID限购一件！',stayTime:2000,type:"success"});	
	        	}else{
	        		num = num + 1;		
	        	}

	        }
	        obj.html(num);
	        temp_count = num;
	    });


	    //加入购物车
	    var el;
	    var is_size = true,
	    	is_zdy = true;
		$(".ui-btn-danger").tap(function(){
			var id = $('#id').val();
			var is_ppl = $("#is_ppl").val();
			var ppl_num = $("#ppl_num").val();
			var allow_buy = $('#allow_buy').val();

			if(allow_buy == 1){
				$.tips({content:'您已经购买过，请勿重新下单！',stayTime:2000,type:"success"});
				return false;
			}

			if( is_ppl == 1 && ppl_num <= 0 ){
				$.tips({content:'该限购商品库存不足，无法购买！',stayTime:2000,type:"success"});
				return false;
			}

			$.get("{:U('Cart/addCart')}", {
				goods_id: id,
				num: temp_count,
				is_ppl: is_ppl
			}, function(r) {
				if (r.status) {
					//layer.msg('加入成功！', {time: 1000});
					if(r.is_add == "yes"){
						if($('.cartIndex i span').hasClass('ui-badge-cornernum')){
							$('.ui-badge-cornernum').html( parseInt( parseInt( $('.ui-badge-cornernum').html() ) + temp_count ) );	
						}else{
							$('.cartIndex i').html('<span class="ui-badge-cornernum">'+temp_count+'</span>');
						}
					}
					$('.ui-size-survey-wrap').removeClass('show');
					el=$.tips({
				        content:r.info,
				        stayTime:2000,
				        type:"success"
				    })
				} else {
					el=$.tips({
				        content:r.info,
				        stayTime:2000,
				        type:"success"
				    })
				}
			}, 'json');
		});
		//收藏
		$('.collect').tap(function(){
			var goods_id = $('#id').val();
			$.get("{:U('goodsCollect')}", {goods_id: goods_id}, function(r){
				if(r.status){
					if(r.collect_status == 0){
						$.tips({
					        content:'取消收藏成功！',
					        stayTime:2000,
					        type:"success"
					    });
					    $('.div_collect').find('a').removeClass('selected').find('span').html('收藏');
					}else{
						$.tips({
					        content:'收藏成功！',
					        stayTime:2000,
					        type:"success"
					    });
						$('.div_collect').find('a').addClass('selected').find('span').html('已收藏');
					}
					
				}else{
					$.tips({
				        content:'收藏失败！',
				        stayTime:2000,
				        type:"success"
				    });
				}
			}, 'json');
		});
		//关闭警告框
		$('.icon-roundclosefill').tap(function(){
			$('.ui-tooltips-warn').hide();	//关闭警告框
		});
		//进入购物车
		$('.cartIndex').tap(function(){
			window.location.href = "{:U('Cart/index')}";
		});
		//尺码助手
		$('.size_helper').tap(function(){
			$('.size_helper_info').toggleClass('show');
		});
		//测量方法
		$('.measure').tap(function(){
			window.location.href = "{:U('goods_info', array('type' => 5, 'id' => $row['id']))}";
		});
		//确定测量结果
		$('.sure-measure').tap(function(){
			$('.size_helper_info').removeClass('show');
		});
		//商品属性
		$('.goods_nature').tap(function(){
			$('.goods_nature_info').toggleClass('show');
		});
		$('.cl_size').tap(function(){
			var color_value = $('#color').val();
			if(color_value.length == 0){
				$('.ui-tooltips-warn').show();	//提示框	
				window.location.href = "#goods_tip";
				return false;
			}
			showSize();
		});
		$('.ui-size-survey-wrap .icon-roundclosefill').tap(function(){
			$('.ui-size-survey-wrap').removeClass('show');
		});
		function showSize(){
			$('.ui-size-survey-wrap').addClass('show');
			$('.size_img_url').attr('src', $('.color-lsit .selected img').attr('src'));
		}

	</script>
</block>